import router from '@/router'
import store from '@/store'

router.beforeEach(async(to, from, next) => {
  const url = to.path
  const token = store.getters.token
  const whiteList = ['/login', '/404', '/test']
  // 1. 已经登录 去登录页 => 首页
  if (token && url === '/login') {
    next('/')
  }

  // 2. 已经登录 去其他页 => 放行
  if (token && url !== '/login') {
    // 目标： 进入所有后台页面之前，先装备好用户资料   ---导航守卫，不在组件里面拿
    if (!store.state.user.userInfo.userId) {
      await store.dispatch('user/getUserInfo')
      // 确保拿完用户数据以后进行权限的处理
      // 因为需要同时根据权限，恢复菜单和页面路由（不是同一个东西）
      // 这里的逻辑可以封装到vuex里面
      const menus = store.state.user.userInfo.roles.menus
      const routes = await store.dispatch('permission/filterRoutes', menus)
      console.log('筛选后路由', routes)
      // 这里筛选出了结果，只需要将数据使用 router.addRoutes() 调用即可
      // 在url上面输入
      router.addRoutes([
        ...routes,
        { path: '*', redirect: '/404', hidden: true }
      ])
      // 如果是刷新之类第一次进入页面，追加完路由，需要按照原来的目的地地址，再跳转一次
      // 以再次触发路由匹配
      next(to.path)
      return
    }
    next()
  }

  // 3. 未登录 在白名单 => 放行
  if (!token && whiteList.indexOf(url) > -1) {
    next()
  }

  // 4. 未登录 不在白名单 => 登录页
  if (!token && whiteList.indexOf(url) === -1) {
    next('/login')
  }

  if (store.getters.token) {
    // 有登陆
    if (to.path === '/login') {
      // 不能去登录页
      next('/')
    } else {
      // 其他页放行
      next()
    }
  } else {
    // 未登录
    const whiteList = ['/login', '/404', '/test']
    if (whiteList.indexOf(to.path) > -1) {
      // 在白名单中 放行
      next()
    } else {
      // 其他跳到登录页
      next('/login')
    }
  }
})
